<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>提交</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">

    <link rel="stylesheet" href="/static/layui/css/layui.css" media="all">
    <!--<link rel="stylesheet" href="/static/css/public.css">-->
    <script type="application/javascript" src="/static/js/jQuery.js"></script>
    <script type="application/javascript" src="/static/layui/layui.js"></script>
    <script type="application/javascript" src="/static/js/utils.js"></script>
    <style>
        .layui-form-item .div-input-inline_double{
            width: 320px;
        }
        .layui-form-item .div-input-inline_sm{
            width: 160px;
        }
        .temp-num{
            color: red;
        }
    </style>
</head>
<body>
    <div class="formBody">
        <div class="formContext">
            <form class="layui-form">
                <div class="layui-form-item">
                    <label class="layui-form-label">姓名</label>
                    <div class="layui-input-inline">
                        <input type="text" name="userName" class="layui-input" disabled/>
                    </div>
                    <label class="layui-form-label">联系方式</label>
                    <div class="layui-input-inline">
                        <input type="text" name="loginTel" class="layui-input" disabled/>
                    </div>
                </div>
                当日计划
                <hr/>
                <div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">计划时间</label>
                        <div class="layui-input-inline div-input-inline_sm">
                            <input type="text" disabled class="layui-input" value="">
                        </div>
                        <label class="layui-form-label">计划事项</label>
                        <div class="layui-input-inline div-input-inline_double">
                            <input type="text" disabled class="layui-input" value=""/>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">完成时间</label>
                        <div class="layui-input-inline div-input-inline_sm">
                            <input type="text" name="planTime" lay-verify="required" class="layui-input">
                        </div>
                        <label class="layui-form-label">实际情况</label>
                        <div class="layui-input-inline div-input-inline_double">
                            <input type="text" name="plan" lay-verify="required" class="layui-input" placeholder="请输入内容"/>
                        </div>
                    </div>
                </div>
                明日计划(当前第<span class="temp-num">1</span>条)
                <hr/>
                <input name="tomorrowPlanNum" type="hidden">
                <div id="tomorrowPlanTemplate">
                    <div class="layui-form-item">
                        <label class="layui-form-label">计划时间</label>
                        <div class="layui-input-inline div-input-inline_sm">
                            <input type="text" name="planTime0" lay-verify="required" class="layui-input" id="dateTemp0">
                        </div>
                        <label class="layui-form-label">计划事项</label>
                        <div class="layui-input-inline div-input-inline_double">
                            <input name="planContext0" lay-verify="required" class="layui-input" placeholder="请输入内容"/>
                        </div>
                    </div>
                </div>

                <div id="tomorrowPlanEnd"><span class="layui-badge layui-bg-orange" id="addOne">新增</span></div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="formSubmit">立即提交</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <script type="application/javascript">
        $(function () {
            var userName = getCookie("userName");
            var userTel = getCookie("userTel");

            $("input[name='userName']").val(userName);
            $("input[name='loginTel']").val(userTel);
        });

        layui.use(['laydate','form'],function(){

            var laydate = layui.laydate;

            // laydate.render({
            //     elem: '#dateTemp',
            //     type: 'time'
            // });

            //监听提交
            layui.form.on('submit(formSubmit)', function(data){

                $.ajax({
                    type: "POST",
                    url: "/customerRest/save",
                    data: data.field,
                    success: function(result){
                        console.debug(result);
                        layer.msg(result.msg);
                        var index = parent.layer.getFrameIndex(window.name);//获得index
                        setTimeout(function () {
                            parent.layer.close(index);
                            parent.location.href = "/customer/list";
                        }, 1000);//延迟

                    }
                });

                return false;//阻值表单跳转
            });


            var num = 1;
            //js
            $("#addOne").on('click',function () {
                $(".temp-num").text(num + 1);
                $("input[name='tomorrowPlanNum']").val(num + 1);
                var planTemp = $("#tomorrowPlanTemplate").html();
                console.debug(planTemp);

                planTemp = planTemp.replace("dateTemp0", "dateTemp" + num);
                planTemp = planTemp.replace("planTime0", "planTime" + num);
                planTemp = planTemp.replace("planContext0", "planContext" + num);
                $("#tomorrowPlanEnd").before(planTemp);


                num++;
            });



        });


    </script>
</body>
</html>